import 'package:flutter/material.dart';
import 'package:untitled/pages/home/tab_search/filter_bar/data.dart';
import 'package:untitled/scoped_model/room_filter.dart';
import 'package:untitled/utils/scopoed_model_helper.dart';
import 'package:untitled/widgets/common_title.dart';

/*
* 过滤条件抽屉
* */
class FilterDrawer extends StatelessWidget {
  const FilterDrawer({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    var dataList = ScopedModelHelper.getModel<FilterBarModel>(context).dataList;
    roomTypeList = dataList['roomTypeList'];
    orientedList = dataList['orientedList'];
    floorList = dataList['floorList'];
    var selectedIds = ScopedModelHelper.getModel<FilterBarModel>(context).selectedList.toList();

    _onChange(String val){
      ScopedModelHelper.getModel<FilterBarModel>(context).selectedListToggleItem(val);
    }
    return Drawer(
      child: SafeArea(child: ListView(//使用一个SafeArea可以解决组件被状态栏遮挡问题
        children: [
          CommonTitle('户型'),
          FilterDrawerItem(list: roomTypeList,selectedIds: selectedIds,onChange: _onChange,),
          CommonTitle('朝向'),
          FilterDrawerItem(list: orientedList,selectedIds: selectedIds,onChange: _onChange,),
          CommonTitle('楼层'),
          FilterDrawerItem(list: floorList,selectedIds: selectedIds,onChange: _onChange,),
        ],
      ),),
    );
  }
}
class FilterDrawerItem extends StatelessWidget {
  final List<GeneralType> list;
  final List<String> selectedIds;//选中条目的id
  final ValueChanged<String> onChange;//数据改变事件
  const FilterDrawerItem({Key key, this.list, this.selectedIds, this.onChange}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.only(left: 10.0,right: 10.0),
      child: Wrap(
        runSpacing: 10.0,
        spacing: 10.0,
        children: list.map((item){
          var isActive = selectedIds.contains(item.id);//是否选中
          return GestureDetector(
            onTap: (){
              if(onChange != null)onChange(item.id);
            },
            behavior: HitTestBehavior.translucent,//为了点击空白区域也能触发事件
            child: Container(
              width: 100,
              height: 40,
              decoration: BoxDecoration(
                  color: isActive?Colors.green:Colors.white,
                  border: Border.all(width: 1.0,color: Colors.green)
              ),
              child: Center(
                child: Text(item.name,style: TextStyle(color: isActive?Colors.white:Colors.green),),
              ),
            ),
          );
        }).toList(),
      ),
    );
  }
}

